<template>
  <page-meta :root-font-size="$rootFontSize"></page-meta>
  <view>
    <!--平台公告-->
    <u-navbar
      title="平台公告"
      leftIcon="arrow-left"
      leftIconSize="40"
      leftIconColor="#000000"
      @rightClick="isShow = true"
      :placeholder="true"
      :autoBack="true"
    >
      <!-- <view slot="right" @click="isShow = true"
        ><u-icon name="search" size="44" color="#000000"></u-icon
      ></view> -->
    </u-navbar>
    <!--加载组件-->
    <u-loading-page
      :loading="isLoading"
      loading-mode="spinner"
      icon-size="56rpx"
      loading-text="拼命加载中..."
      fontSize="28rpx"
      class="z-50 top-10"
    ></u-loading-page>

    <view class="ml-4" v-if="list.length > 0">
      <view
        class="w-full border-b-grayLight py-4"
        v-for="(item, index) in list"
        :key="item.id"
      >
        <view class="mr-3">
          <view class="flex items-center justify-between">
            <view
              class="text-sm text-dark w-3/4 truncate"
              @click="goDetail(item)"
              >{{ item.title }}</view
            >
            <view class="text-xs text-light" @click="goDetail(item)">{{
              item.createTime | timeFormat
            }}</view>
          </view>
        </view>
      </view>
    </view>
    <b-empty v-else></b-empty>
  </view>
</template>

<script>
import dayjs from 'dayjs';
import 'dayjs/locale/zh-cn';
import relativeTime from 'dayjs/plugin/relativeTime';
import { getNoticesList } from '../../services/customer';
dayjs.extend(relativeTime);
dayjs.locale('zh-cn');

export default {
  filters: {
    timeFormat(value) {
      const date = dayjs(value).fromNow();
      return date;
    },
  },
  data() {
    return {
      isShow: true,
      isLoading: true,
      list: [],
    };
  },
  async onShow() {
    this._getNoticesList();
  },
  methods: {
    //路由跳转
    goTo(url) {
      this.$Router.push({
        name: url,
      });
    },
    //平台公告列表
    async _getNoticesList() {
      const { code, data } = await getNoticesList({});
      if (code != 200) return;
      this.list = data.records;
      this.isLoading = false;
    },
    //平台公告详情
    async goDetail(item) {
      this.$Router.push({
        name: 'sysmsg-detail',
        params: {
          id: item.id,
        },
      });
    },
  },
};
</script>

<style></style>
